<template>
  <div>
    <searchEngine></searchEngine>
    <pInfor
      :foo="foo.value"
      @changeLike="changeLike"
      @focusShua="focusShua"
    ></pInfor>
  </div>
</template>
<script setup>
import { onMounted, reactive } from 'vue'
import pInfor from '../components/firstPage/pInfor.vue'
import searchEngine from '../components/firstPage/searchEngine.vue'
import axios from 'axios'
const foo = reactive([])
onMounted(() => {
  test()
})

function test() {
  axios({
    url: 'http://localhost:8080/dynamic/showdynamic',
    method: 'get',
    contentType: 'application/json',
    headers: {
      token: localStorage.getItem('token')
    }
  }).then(function (res) {
    foo.value = res.data.data
  })
}

function changeLike(index) {
  foo.value[index].likeState = !foo.value[index].likeState
  if (foo.value[index].likeState) {
    foo.value[index].likes += 1
  } else {
    foo.value[index].likes -= 1
  }
}

function focusShua() {
  console.log('调用')
  test()
}
console.log('aaaa' + foo)
console.log(foo)
</script>
